<template>
  <div>
    <ul>
      <li class="l1">
        <van-field class="tou"></van-field>
        <p>未登录</p>
      </li>
      <li>
        <p>红包卡卷<van-field class="tou1"></van-field></p>
        
        <p>黄金VIP<van-field class="tou1"></van-field></p>
        
        <p>红包签到<van-field class="tou1"></van-field></p>
      </li>
      <li class="dd">
        <van-grid >
          <van-grid-item icon="photo-o" text="待付款" />
          <van-grid-item icon="photo-o" text="待发货" />
          <van-grid-item icon="photo-o" text="待收货" />
          <van-grid-item icon="photo-o" text="待评价" />
          
        </van-grid>
      </li>
    </ul>
  </div>
</template>

<script setup>
</script>

<style lang="scss" scoped>
.l1 {
  width: 300px;
  height: 100px;
  line-height: 100px;
  margin-left: 50px;
}
.tou {
  background: #ccc;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  line-height: 100px;
  float: left;
}
.tou1 {
  background: #ccc;
  border-radius: 50%;
  width: 25px;
  height: 25px;
}
p {
  width: 100px;
  float: left;
}
.dd{
    margin-top: 50px;
}
</style>